<template lang="pug">
  .zgplugin-checkbox.zgplugin-empty(v-if="(!exist || !show)&&editor")
    svg-icon.empty-icon(icon-class="组件多选框")
  el-form-item.zgplugin-checkbox(v-else-if="exist" v-show="show"  ref="formItem" :prop="config.propertyName"  :rules="rules" label-width="0px")
    requiredLabel(:required="required" :label="config.label")
    van-checkbox-group(v-model="rootForm.properties[config.propertyName]" :disabled="readonly" @change="change")
      van-checkbox(v-for="item in options" :key="item.value" :name="item.value" shape="square" :checked-color="config.checkedColor") {{item.label}}
</template>
<script>

import renderCommon from "../common/renderCommon"
export default {
  mixins: [renderCommon],
  methods: {
    change(value) {
      this.$refs.formItem.$emit('el.form.change', value)
      return this.config.changeCb && this.getParsedFn('changeCb')()
    }
  }
}
</script>
<style lang="scss">
  .zgplugin-checkbox {
    margin-top: 16px;
    margin-bottom: 0 !important;
  }
</style>
